<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">
    <!-- 避免IE使用兼容模式 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>添加项目信息</title>
    <script type="text/javascript" src="./../../../static/js/include/_include-css.js"></script>

</head>

<body class="bg-white">
    <div class="wrapper">
        <div class="wrapper-content">
            <div class="form-header">项目基本信息</div>

            <form class="form-horizontal" id="form-project-add">
                <div class="row">
                    <div class="col-sm-12">
                        <div class="form-group">
                            <label class="col-sm-2 control-label is-required">项目编号：</label>
                            <div class="col-sm-3">
                                <input class="form-control required" type="text" name="code" id="code"
                                    placeholder="请输入项目编号" data-msg="请输入项目编号">
                            </div>

                            <label class="col-sm-3 control-label is-required">项目名称：</label>
                            <div class="col-sm-3">
                                <input class="form-control required" type="text" name="name" id="name"
                                    placeholder="请输入项目名称" data-msg="请输入项目名称">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label is-required">开工日期：</label>
                            <div class="col-sm-3">
                                <input class="form-control required time-input bg-white" type="text" readonly
                                    name="startTime" id="startTime" placeholder="请选择项目开工日期" data-msg="请选择项目开工日期">
                            </div>

                            <label class="col-sm-3 control-label is-required">竣工日期：</label>
                            <div class="col-sm-3">
                                <input class="form-control required time-input bg-white" type="text" readonly
                                    name="endTime" id="endTime" placeholder="请选择项目竣工日期" data-msg="请选择项目竣工日期">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label is-required">项目经理：</label>
                            <div class="col-sm-3">
                                <input class="form-control required" type="text" name="manager" placeholder="请输入项目经理"
                                    data-msg="请输入项目经理">
                            </div>

                            <label class="col-sm-3 control-label is-required">联系电话：</label>
                            <div class="col-sm-3">
                                <input class="form-control required" type="text" name="phone" id="phone"
                                    placeholder="请输入联系电话" data-msg="请输入联系电话">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label is-required">施工单位：</label>
                            <div class="col-sm-3">
                                <select class="form-control required select2">
                                    <option value="">请选择施工单位</option>
                                    <option value="1">施工单位A</option>
                                    <option value="2">施工单位B</option>
                                    <option value="3">施工单位C</option>
                                    <option value="4">施工单位D</option>
                                </select>
                            </div>

                            <label class="col-sm-3 control-label is-required">投标单位：</label>
                            <div class="col-sm-3">
                                <select class="form-control required select2">
                                    <option value="">请选择投标单位</option>
                                    <option value="1">投标单位A</option>
                                    <option value="2">投标单位B</option>
                                    <option value="3">投标单位C</option>
                                    <option value="4">投标单位D</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">项目描述：</label>
                            <div class="col-sm-9">
                                <textarea class="form-control" rows="3" name="remark" id="remark"></textarea>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
            <div class="form-header">任务情况</div>
            <div class="row">
                <div class="col-xs-12">
                    <p>
                        <a class="btn btn-primary btn-sm" href="javascript:;" onclick="addRow();"><i class="fa fa-plus"></i>新增任务</a>
                    </p>
                </div>
                <div class="col-xs-12">
                    <table class="table table-hover" >
                        <thead class="bg-gray">
                            <tr>
                                <th>任务名称</th>
                                <th>任务状态</th>
                                <th>开始日期</th>
                                <th>计划完成日期</th>
                                <th style="width: 160px;">当前进度</th>
                                <th>参与人员</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody id="table_body">

                        </tbody>
                    </table>
                </div>
                <div class="col-xs-12 text-center">
                    <a class="btn btn-primary"><i class="fa fa-fw fa-check"></i>保存信息</a>
                    <a class="btn btn-danger" href="javascript:;" onclick="$.modal.closeTab()"><i class="fa fa-fw fa-remove"></i>关闭页面</a>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="./../../../static/js/include/_include-js.js"></script>

    <script type="text/javascript">
        $(function () {
            addRow();
            addRow();
            addRow();
        });
        function addRow() {
            var element = $($("#table_row_template").html());
            element.find(".row-delete").click(function(){
                element.remove();
            });
            $("#table_body").append(element);
            element.find(".select2").select2();
            loadLayDate(element.find(".time-input"));
        }
    </script>

</body>
<template id="table_row_template">
    <tr>
        <td>
            <input type="text" placeholder="请输入任务名称" class="form-control column1">
        </td>
        <td>
            <select class="form-control select2 column2" name="select">
                <option value="2">进行中</option>
                <option value="1">已结束</option>
                <option value="3">暂停</option>
                <option value="0">未开始</option>
            </select>
        </td>
        <td>
            <input type="text" placeholder="请选择开始日期" readonly class="form-control time-input bg-white column3">
        </td>
        <td>
            <input type="text" placeholder="请选择计划完成日期" readonly class="form-control time-input bg-white column4">
        </td>
        <td>
            <div class="input-group">
                <input type="number" class="form-control column5">
                <span class="input-group-addon">
                    %
                </span>
            </div>
        </td>
        <td>
            <input type="text" placeholder="请录入参与人员" class="form-control 6">
        </td>
        <td>
            <a class="btn btn-danger btn-sm row-delete">删除</a>
        </td>
    </tr>
</template>

</html>